<template>
	<view class="bgColor-white" style="width: 100%;height: 100%;">
		<cu-custom bgColor="bg-gradual-blue-light" :isBack="true" backText="返回" title="银行卡操作">
		</cu-custom>
		<view class="content" v-if="bankCode">
			<bankItem :bankCode="bankCode" :bankName="bankName" :cardCode="cardCode"></bankItem>
		</view>
		<view class="padding flex flex-direction">
			<button class="cu-btn bg-blue-light lg" :disabled="mainFlag" style="font-size: 35rpx;" @tap="setTap">调整默认银行卡</button>
			<button class="cu-btn bg-red margin-tb-sm lg" :disabled="mainFlag" style="font-size: 35rpx;" @tap="delTap">解绑银行卡</button>
		</view>
		<view v-if="mainFlag"  style="display: flex;flex-direction: row;align-items: center;justify-content: flex-start;padding: 20rpx 20rpx 20rpx 20rpx;">
			<text class="icon cuIcon-info" style="font-size: 32rpx;padding-right: 10rpx;"></text>
			<text style="font-size: 32rpx;">该卡片为默认银行卡，不能操作，如需解绑，请先将其他银卡卡设置为默认银行，再进行操作</text>
		</view>
		<u-modal v-model="showModel" :show-title="false" :show-cancel-button="true" :content="content" @confirm="confirm"></u-modal>
	</view>
</template>

<script>
	import api from '@/api/society/my/bankCard.js'
	import reqConfig from '@/common/config/reqConfig.js'
	import bankItem from './bank-item.vue';
	export default {
		components: {
			bankItem
		},
		onLoad: function(option) {
			if (this.$Route.query) {
				this.bankCode = this.$Route.query.bankCode;
				this.bankName = this.$Route.query.bankName;
				this.cardCode = this.$Route.query.cardCode;
				this.bindId = this.$Route.query.bindId;
				if(this.$Route.query.mainFlag=='1'){
					this.mainFlag=true
				}
			}

		},
		data() {
			return {
				bankCode: null,
				bankName: '',
				cardCode: '',
				mainFlag: false,
				bindId:null,
				showModel: false,
				content:'',
				editType:''
			};
		},
		methods: {
			setTap() {
				this.showModel = true
				this.content='确定调整此银行卡为默认银行卡吗？'
				this.editType='update'
			},
			delTap() {
				this.showModel = true
				this.content='确定解绑此银行卡吗？'
				this.editType='delete'
			},
			confirm(){
				const data = {}
				data.bindId=this.bindId
				let sendApi=''
				if(this.editType=='update'){
					sendApi = api.setbankcard
				}else{
					sendApi = api.removebankcard
				}
				this.$http.post(sendApi, data).then(res => {
					this.$Router.back(1)
				}).catch(error => {
					
				})
			}
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		padding: 20rpx;
		margin: 0 auto;  
	}
</style>
